.container-login100 {
  width: 100%;  
  min-height: 100vh;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  padding: 15px;
  background: #9053c7;
  background: -webkit-linear-gradient(-135deg, #3f53ba,#50c86a, #3f53ba,#50c86a);
}
.cbp-hrmenu {
	width: 100%;
}

/* general ul style */
.cbp-hrmenu ul {
    display:grid;
    list-style-type:none;
    grid-template-columns: repeat(6, auto);
	
}

/* first level ul style */
.cbp-hrmenu > ul,
.cbp-hrmenu{
	margin: 0 auto;
	padding: 0 1.875em;

}

.cbp-hrmenu > ul > li {
    padding: 2em;
    color:#E98A8A;

}

.cbp-hrmenu > ul > li > a {
	font-weight: 700;
	padding: 1em 2em;
	color: #f08519;
	display: inline-block;
}

.cbp-hrmenu > ul > li > a:hover {
	color: #09445a;
}

.cbp-hrmenu > ul > li.cbp-hropen a,
.cbp-hrmenu > ul > li.cbp-hropen > a:hover {
	color: #fff;
}

/* sub-menu */
.cbp-hrmenu .cbp-hrsub {
	display: none;
	position: absolute;
	background: #47a3da;
	width: 100%;
	left: 0;
}

.cbp-hropen .cbp-hrsub {
	display: block;
	padding-bottom: 3em;
}

.cbp-hrmenu .cbp-hrsub-inner > div {
	float: left;
	padding: 0 2em 0;
}

.cbp-hrmenu .cbp-hrsub-inner:after {
	clear: both;
}

.cbp-hrmenu .cbp-hrsub-inner > div a {

}

.cbp-hrsub h4 {
	color: #afdefa;
	padding: 2em 0 0.6em;
	margin: 0;
	font-size: 160%;
	font-weight: 300;
}

.img { 
    width:150px;
    justify-self:center;
}

.ul .li .span {
    display:block;
    font-size:1.4em;
    color: white;
}
.container {
    display:grid;
    grid-template-columns: 66% auto;
    padding: 4em 1em;
    border-bottom: 4px solid #47a3da;
}
/* Examples for media queries */



@media screen and (max-width: 500px) { 

.body {
    font-family: 'Source Sans Pro';
    background:red;
    margin:0;
    color:white;
    display:grid;
    grid-template-columns: auto;
    grid-template-rows: auto 60% 40%;
   
}
.header {
		 grid-template-areas: 
    "simasbludlogo--"
    "kemendagri"
    "favicon--";
	}


	.cbp-hrmenu {
        grid-template-columns: auto;
        grid-template-rows: auto;

	}

	.cbp-hrmenu > ul,
	.cbp-hrmenu .cbp-hrsub-inner {
		width: 100%;
		padding: 0;
        grid-template-columns: auto;
        grid-template-rows: auto;
	}

	.cbp-hrmenu .cbp-hrsub-inner {
		padding: 0 2em;
	}

	.cbp-hrmenu > ul > li {
		display: block;
	}

	.cbp-hrmenu > ul > li > a { 
		display: block;
		padding: 1em 3em;
	}

	.cbp-hrmenu .cbp-hrsub { 
		position: relative;
	}

	.cbp-hrsub h4 {
		padding-top: 0.6em;
	}


}

@media screen and (max-width: 500px) { 
	.cbp-hrmenu .cbp-hrsub-inner > div {
		width: 100%;
		float: none;
		padding: 0 2em;
        grid-template-columns: auto;
        grid-template-rows: auto;
     
    }

	.cbp-hrmenu > ul,.cbp-hrmenu{
	margin: 0 auto;
	padding: 0 1.875em;

}
	.container {
        display:grid;
        padding: 1em 3em;
    grid-template-columns: auto;
	margin-top:20px;

	}
	.a{
		font-size: 7pt;
	}
	.img{width: 50%;}
}
.element.style {
    display: none;
}